<template>
  <div class="wrapper-left">
    <!-- 数据对比 -->
    <SjdbCard style="animation: slide-left 2s; animation-duration: 0.8s"></SjdbCard>
    <!-- 厂区环境和省控趋势对比 -->
    <CqTrendComparion style="animation: slide-left 2s; animation-duration: 1.2s"></CqTrendComparion>
    <!-- 产区环境变化趋势 -->
    <CqTrendChange style="animation: slide-left 2s; animation-duration: 1.6s"></CqTrendChange>
  </div>
</template>

<script>
import SjdbCard from './SjdbCard.vue'
import CqTrendComparion from './CqTrendComparion.vue'
import CqTrendChange from './CqTrendChange.vue'
export default {
  components: {
    SjdbCard,
    CqTrendComparion,
    CqTrendChange
  },
  data() {
    return {}
  }
}
</script>

<style lang="scss" scoped>
.wrapper-left {
  width: 400px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
</style>
